<script setup>
import SonComCom from './SonComCom.vue'

// 子组件通过props接收父组件传递的数据
const props =  defineProps({
  msg:{
  type:String,
  required:true
}
})

// 子传父
const emit = defineEmits(['update:msg'])
const sendMsg = () => {
  emit('update:msg','子组件添加😸'+props.msg)
}


const myMsg = '子组件自己内部的数据'
const validate=()=>{
  console.log('内部实现了表单校验')
}

defineExpose({
  myMsg,
  validate
})

</script>
<template>
<!-- 结构 -->
<div class="son">
  <h2>子组件</h2>
  <p>{{msg}}</p>

  <button @click="sendMsg">发送消息</button>

<SonComCom />
</div>
</template>

<style>
/* 样式 */
.son{
  border: 5px solid blue;
}
</style>
